<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>News Article</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: white;

        }
        .container {
        display: flex;
            background-color: white;
            padding: 20px;


            width: 100%;
            height:100%;
            flex-direction: column;
        }
        h1 {
        text-align: center;
        margin: 0 0 15px;
        padding: 10px 0;
        font-size: 24px;
        }
        .meta {
            display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 20px;
        }
        .meta span {
            margin: 0;
        }
        img {
            max-width: 320px;
            height:320px;

            border-radius: 8px;
            margin-bottom: 15px;
        }
        p {
            line-height: 1.6;
            text-size:10px
        }

    </style>
</head>
<body>
<div class="container">
    <h1 id="title">标题</h1>
    <div class="meta">
        <span id="classify">类别</span>
        <span id="time">日期</span>
    </div>
    <img class="photo" alt="News Image" id="photo" src="../pic/bg.png">
    <p id="know">正文</p>
</div>
</body>
<script type="text/javascript">

    <!--    function goBack() {-->
        <!--        myInterface.goBack(true, document.getElementById('title').innerHTML.trim());//调用Android方法-->
        <!--    }-->

    <!--    function setTitle(title) { //此方法在Android Java代码中被调用-->
        <!--        document.getElementById('title').innerHTML = title; //把新标题设置到页面上-->
        <!--        myInterface.onTitleUpdate(true, title); //调用Android方法,提示新标题已经设置-->
        <!--    }-->
    <!--    function setKnow(know) { //此方法在Android Java代码中被调用-->
        <!--        document.getElementById('know').innerHTML = know; //把新标题设置到页面上-->
        <!--&lt;!&ndash;        myInterface.onTitleUpdate(true, know); //调用Android方法,提示新标题已经设置&ndash;&gt;-->
        <!--    }-->
    <!--    function setPhoto(photo) { //此方法在Android Java代码中被调用-->
        <!--        document.getElementById('photo').innerHTML = photo; //把新标题设置到页面上-->
        <!--&lt;!&ndash;        myInterface.onTitleUpdate(true, title); //调用Android方法,提示新标题已经设置&ndash;&gt;-->
        <!--    }-->

        function updateNews(title, classify, time, photo, know) {
            document.getElementById("title").textContent = title;
            document.getElementById("classify").textContent = classify;
            document.getElementById("time").textContent = time;
            document.getElementById("photo").src = photo;
            document.getElementById("know").textContent = know;

        }




</script>
</html>
